<template>
  <div>
<headerMidder title="我的收藏"></headerMidder>
<!-- <div class="item" v-for='(item,index) in collectiionList' :key=index>
<div class="title">
  {{item.title}}
</div>
<div class="cover" v-if='item.cover'> -->
  <!-- <div class="imgwrapper">
    <img src="/static/imgs/avatar.jpg" alt="">
  </div>
  <div class="imgwrapper">
    <img src="/static/imgs/avatar.jpg" alt="">
  </div> -->
  <!-- <div class="imgwrapper" v-for="(img,index) in item.cover" :key=index>
    <img :src="img.url" alt="">
  </div>
</div>
<div class="info">
  {{item.user.nickname}} {{item.comments.length}}跟帖
</div>
</div> -->
<post :post="item" v-for='(item,index) in collectiionList' :key='index'></post>
  </div>
</template>

<script>
import headerMidder from '../components/headerMidder'
import post from '../components/post'
export default {
components:{
    headerMidder:headerMidder,
    post:post
},
data(){
  return{
    collectiionList:[]
  }
},
mounted(){
  this.$axios({
    url:'/user_star',
    method:'get',
  }).then(res=>{
    console.log("这里是收藏的data"+res.data);
 this.collectiionList=res.data.data
    this.collectiionList.forEach(element => {
       element.comment_length = element.comments.length
      if(element.cover){
        element.cover.forEach(element=>{
          if(element.url.indexOf('http')<0){
            element.url = this.$axios.defaults.baseURL + element.url
          }
        })
      }
    });
  })
}
}
</script>

<style lang="less" scoped>
.item{
  padding: 5.556vw;
  border-bottom: 1px solid #eee;
}
.cover{
  display: flex;
  margin-top: 2.778vw;
}
.imgwrapper{
  width: 33%;
  height: 22.222vw;
  overflow: hidden;
  img{
    width: 100%;
    height: auto;
  }
}
.info{
  margin-top: 2.778vw;
  color: #888;
  font-size: 14px;
}
</style>